<template>
  <t-dialog
    :header="header"
    :visible.sync="visible"
    :onClose="closeDialog"
    :closeOnOverlayClick="false"
    @confirm="onSubmit"
    :confirmBtn="{
        content: loading?'提交中...':'确认',
        theme: 'primary',
        loading: loading,
      }"
    width="40%"
    top="5%"
  >
    <t-form ref="form" :data="formData" labelWidth="100px" :rules="rules">
      <t-form-item label="归口单位" name="departmentId">
        <t-tree-select filterable clearable :treeProps="{keys: {value: 'id'}}" @change="onUnitChange" v-model="formData.departmentId" :data="deptOptions"
                       placeholder="请选择归口单位">

        </t-tree-select>
      </t-form-item>
<!--      <t-form-item label="所属年度" name="year">-->
<!--        <t-date-picker v-model="formData.year" mode="year" clearable/>-->
<!--      </t-form-item>-->
      <t-form-item label="名额" name="quota">
        <t-input-number :min="0" v-model="formData.quota" clearable/>
      </t-form-item>
<!--      <t-form-item label="排序号" name="sort">-->
<!--        <t-input-number clearable v-model="formData.sort" :min="0" placeholder="请输入"></t-input-number>-->
<!--      </t-form-item>-->
    </t-form>
  </t-dialog>
</template>

<script>
import {treeselect} from "@/api/system/dept";

export default {
  name: "add-edit-unit-quota",
  components: {},
  props: ["header", "objId","obj"],
  data() {
    return {
      filterText:"",
      filterByText:"",
      visible: true,
      loading: false,
      deptOptions: [],
      formData: {
        departmentId: null,
        // year: dayjs().year().toString(),
        quota: 0,
        departmentName:''
      },
      rules: {
        departmentId: [{required: true, message: "归口单位不能为空"}],
        year: [{required: true, message: "所属年度不能为空"}],
      }
    }
  },
  watch: {
    objId: {
      immediate: true,
      handler(val) {
        if (val) {
          this.getObj();
        }
      }
    },
    obj: {
      immediate: true,
      handler(val) {
        if(val){
          this.formData =val;
        }
      }
    }
  },
  created() {
    // if(!this.objId){
    //   this.getTreeSelect();
    // }
    this.getTreeSelect();
  },
  methods: {
    onUnitChange(val,content){
      this.formData.departmentName = content.node.data.label;
    },
    getObj() {
      // 获取
    },
    /** 查询部门下拉树结构 */
    getTreeSelect() {
      treeselect().then((res) => {
        this.deptOptions = res.data;
      }).catch((e) => {
        this.$message.error(e.toString());
      });
    },
    onSubmit() {
      this.$refs.form.validate().then((validateResult) => {
        if (validateResult === true) {
          this.loading = true;
          if (this.objId !== 0) {
            this.$emit("updateData", this.formData);
            this.$emit("update:visible", false);
            this.loading = false;
          } else {
            this.$emit("addData",this.formData);
            this.$emit("update:visible", false);
            this.loading = false;
          }
        }
      });
    },
    closeDialog() {
      this.$emit("update:visible", false);
    },
  }
}
</script>

<style scoped>

</style>
